<!-- 巡检记录 -->
<template>
	<div class="zs-table-page-container">
		<!-- 查询条件 -->
		<div class="zs-card-sm zs-space-bottom zs-layout-flex-row zs-layout-justify-between">
			<span>
				<el-input v-model="queryParams.pointName" class="zs-select-md zs-space-right-sm" disabled placeholder=" " />
			</span>
		</div>

		<!-- teble -->
		<div class="zs-card zs-table-page-content">
			<el-table class="zs-table-page-main" :data="tableData.data" v-loading="tableData.loading" stripe>
				<el-table-column type="index" label="序号" width="60" align="center" :index="(index) => index + 1 + (tableData.currentPage - 1) * curPageSize" />
				<el-table-column prop="inventoryName" label="路线名称" show-overflow-tooltip align="left" :formatter="defaultTableData" />
				<el-table-column prop="inventoryName" label="计划处理人" show-overflow-tooltip align="left" :formatter="defaultTableData" />
				<el-table-column prop="inventoryName" label="实际处理人" show-overflow-tooltip align="left" :formatter="defaultTableData" />
				<el-table-column prop="formatterStartDate" label="开始时间" show-overflow-tooltip align="left" :formatter="defaultTableData" />
				<el-table-column prop="formattertEndPlanDate" label="计划结束时间" show-overflow-tooltip align="left" :formatter="defaultTableData" />
				<el-table-column prop="formattertEndDate" label="实际结束时间" show-overflow-tooltip align="left" :formatter="defaultTableData" />
				<el-table-column prop="effectiveState" label="状态" align="center">
					<template #default="{ row }">
						<span :class="row.effectiveState == 1 ? 'zs-validata-status-yes' : 'zs-validata-status-no'">{{ row.effectiveState == 1 ? '有效' : '失效' }}</span>
					</template>
				</el-table-column>
				<el-table-column prop="" label="流程日志" width="90" align="center">
					<template #default>
						<el-button class="zs-link" link size="small" v-btnPermi="{ permis: ['p_btn_property_project_device_list_as_view'] }">查看</el-button>
					</template>
				</el-table-column>
			</el-table>
			<div class="zs-space-top-sm zs-table-page-pagination">
				<el-pagination v-model:currentPage="tableData.currentPage" v-model:page-size="curPageSize" :page-sizes="curPageSizes" :small="true" :background="true" layout="total, sizes, prev, pager, next, jumper" :total="tableData.total" @size-change="pageChange('size', $event)" @current-change="pageChange('page', $event)" />
			</div>
		</div>
	</div>
</template>

<script setup>
	import { inspectInfoApi, inspectRecordListApi } from '@/api/inspect.js';
	import { ref, reactive } from 'vue';
	import { useStore } from 'vuex';
	import { useRoute } from 'vue-router';
	import { defaultTableData, parseTime } from '@/utils/publicUtils';

	const route = useRoute();
	let store = useStore();
	const curPageSizes = ref(store.state.uiPageSizes);
	const curPageSize = ref(store.state.uiPageSizeDefault);

	// 列表 filed
	let tableData = reactive({
		currentPage: 1,
		total: 0,
		loading: false,
		data: [],
	});

	//查询条件
	let queryParams = reactive({ pageNumber: 1, pageSize: curPageSize.value });

	// 列表数据源
	const queryList = async init => {
		if (process.env.NODE_ENV !== 'development') {
			let portalResourceList = JSON.parse(localStorage.getItem('portalResourceList'));
			if (init != 'init' && !portalResourceList.includes('p_btn_property_project_device_acceptance_standard_list_query')) return;
		}
		// tableData.loading = true;
		// let res = await inspectRecordListApi(queryParams);
		// if (res.data.code !== 200) return;
		// let cList = Object.assign(res.data.data.list)
		// cList.forEach(item => {
		//     item.formatterStartDate = parseTime(item.time1, '{y}-{m}-{d} {h}:{i}')
		//     item.formattertEndPlanDate = parseTime(item.time2, '{y}-{m}-{d} {h}:{i}')
		//     item.formattertEndDate = parseTime(item.time3, '{y}-{m}-{d} {h}:{i}')
		// })
		// tableData.data = cList || [];
		// tableData.total = res.data.data.total || 0;
		// tableData.loading = false;
	};

	// 分页
	const pageChange = (type, size) => {
		if (type == 'size') {
			queryParams.pageSize = size;
		} else {
			queryParams.pageNumber = size;
		}
		queryList('init');
	};

	//设备详情 eid:巡检id
	const getInspectInfo = async () => {
		if (!route.query.eid) return;
		let res = await inspectInfoApi(route.query.eid);
		if (res.data.code !== 200) return;
		queryParams.pointName = res.data.data.inventoryName;
	};

	getInspectInfo();
	queryList('init');
</script>
